/* ===== Base / Resets (light by default) ===== */
:root{
  --bg:#ffffff;
  --text:#212529;
  --muted:#6c757d;
  --card-bg:#ffffff;
  --card-border:#e9ecef;
  --link:#0d6efd;
  --link-hover:#0a58ca;
}

html,body{background:var(--bg);color:var(--text)}
a{color:var(--link);text-decoration:none}
a:hover{color:var(--link-hover);text-decoration:underline}

/* Keep Bootstrap vibe, but rein in headings */
h1{font-weight:700;line-height:1.15;margin:.25rem 0 1rem;
   font-size:clamp(1.75rem,1.2rem + 1.6vw,2.25rem)}
h2{font-weight:600;line-height:1.25;margin:.25rem 0 .75rem;color:var(--muted);
   font-size:clamp(1rem,.9rem + .6vw,1.25rem)}

/* ===== Cards grid ===== */
.card{
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-radius:.75rem;
  overflow:hidden;
}
.card-img-top{
  display:block;
  width:100%;
  height:230px;           /* <- fixed, tidy height */
  object-fit:cover;
}
.card .badge a{color:inherit;text-decoration:none}

/* Position badges without stretching/overlay glitches */
.card .badge{
  pointer-events:auto;
  backdrop-filter:saturate(110%) blur(2px);
}
.position-absolute{z-index:2}

/* Utility: make stretched links not change colors */
.stretched-link{color:inherit}

/* Filter bar spacing (index top controls) */
#filterForm .form-select{
  min-width:160px;
}

/* Image gallery/grid thumbs (if used elsewhere) */
.img-thumb{
  width:100%;height:200px;object-fit:cover;border-radius:.5rem
}

/* Toast animation you already had */
.toast.fade-custom{opacity:0;transform:translateY(-20px);
  transition:opacity .4s ease,transform .4s ease}
.toast.fade-custom.show{opacity:1;transform:translateY(0)}

/* Remove accidental “bars” if any progress/meter elements slipped in */
progress, meter{appearance:none;border:0;background:transparent}
progress::-webkit-progress-bar{background:transparent}
progress::-webkit-progress-value{background:transparent}
meter::-webkit-meter-bar{background:transparent}

/* Make tooltips crisp */
.tooltip{font-size:.85rem}

/* Small screens: tighten top nav controls */
@media (max-width: 992px){
  #filterForm .form-select{min-width:140px}
  .card-img-top{height:210px}
}
